<template>
	<view class="updateUserInfo">
		<view class="content-1" v-if="current">
			<!-- 修改用户信息 -->
			<view class="header" @tap="updateUserInfo">修改用户信息</view>
			<!-- 头像 -->
			<view class="item">
				<view class="text">头像</view>
				<image class="img" :src="userInfo.icon"></image>
			</view>
			<!-- 用户名 -->
			<view class="item">
				<view class="text">用户名</view>
				<view class="username">{{ userInfo.username }}</view>
			</view>
			<!-- 昵称 -->
			<view class="item">
				<view class="text">昵称</view>
				<view class="nickname">{{ userInfo.nickname }}</view>
			</view>
			<!-- 手机号 -->
			<view class="item">
				<view class="text">手机号</view>
				<view class="phone">{{ userInfo.phone }}</view>
			</view>
			<!-- 退出登陆 -->
			<view class="btn" @tap="exitLogin">退出登陆</view>
		</view>
		<view class="content-2" v-else>
			<!-- 修改用户信息 -->
			<view class="header">修改用户信息</view>
			<!-- 头像 -->
			<view class="item">
				<view class="text">头像</view>
				<view class="right" @tap="uploadImg" v-if="icon==''">上传头像</view>
				<image class="img" :src="icon" v-else></image>
			</view>
			<!-- 用户名 -->
			<view class="item">
				<view class="text">用户名</view>
			</view>
			<!-- 昵称 -->
			<view class="item">
				<view class="text">昵称</view>
				<input class="nickname" type="text" v-model="nickname" placeholder="请输入昵称" />
			</view>
			<!-- 手机号 -->
			<view class="item">
				<view class="text">手机号</view>
				<input class="phone" type="text" v-model="phone" placeholder="请输入手机号" />
			</view>
			<!-- 退出登陆 -->
			<view class="btn" @tap="update">更新</view>
		</view>
	</view>
</template>

<script>
	import { updateMemberInfo } from "../../../api/user/index.js"
	import baseUrl from '../../../api/baseUrl.js';
	export default {
		data() {
			return {
				userInfo: {}, // 用户信息
				current: '', // 当前显示
				icon:'', // 头像
				nickname: '', // 昵称
				phone: '', // 手机号
			};
		},
		onLoad() {
			this.current = true;
			this.userInfo = uni.getStorageSync("userInfo")
		},
		methods:{
			// 退出 - 登陆
			exitLogin(){
				// 清除本地缓存 - userInfo + token
				uni.removeStorageSync("userInfo");
				uni.removeStorageSync("token");
				// 跳转 - 登陆
				uni.navigateTo({
					url: "../login/login"
				})
			},
			// 更新 - 用户信息
			updateUserInfo(){
				this.current = false;
				this.nickname = this.userInfo.nickname;
				this.phone = this.userInfo.phone
			},
			// 上传 - 头像
			uploadImg(){
				var _this = this;
				uni.chooseImage({
					count: 1,
					sizeType: ['original'],
					sourceType: ['album'],
					success(res){
						uni.uploadFile({
							url: baseUrl + '/lejuClient/login/uploadAvatar',
							filePath: res.tempFilePaths[0],
							name: "file",
							timeout: 5000,
							success(res1){
								_this.icon = JSON.parse(res1.data).data.fileUrl
							}
						})
					}
				})
			},
			// 更新
			update(){
				updateMemberInfo({
					"id": this.userInfo.id,
					"icon": this.icon,
					"nickname": this.nickname,
					"phone": this.phone
				}).then(res=>{
					console.log(res)
					if(res.data.success){
						uni.showToast({
							title: '更新成功'
						});
						setTimeout(function(){
							uni.navigateTo({
								url: '../login/login'
							})
						},1000)
					}
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
@import './index.scss'
</style>
